<template>
	<view class="sub-evaluate">
		<view class="i-d-title">
			<text class="i-d-t-text">评价完成</text>
			<text class="i-d-t-text1">感谢您的反馈，我们会继续努力给您更好的服务体验</text>
		</view>
		<view class="i-d-top">
			<view class="o-t-title">
				<view class="t-con-text">
					<text class="t-c-text">我的评价</text>
					<uni-rate :value="5" :readonly="true" color="#FFE9BB" active-color="#FEAD1D" />
				</view>
				<view class="sub-ev-tag">
					<uni-tag class="ev-tag" text="服务态度好"
						custom-style="background-color: #F6F6F6; border: 0; color: #737373;border-radius:8rpx;">
					</uni-tag>
				</view>
				<text class="sub-ev-text">虽然一个保洁不算什么，但世界各地无数的保洁，让我们的世界变得干净美好！他是城市最优秀的美容师，他们那不畏寒暑、默默为大家奉献的</text>
			</view>
			<view class="o-t-body">
				<uni-card  title="继续评价" :is-shadow="false" :border="false" :margin="'0 0 20rpx 0'" :spacing="'0 20rpx'" :padding="0">
					<view class="yuyue" :key="i" v-for="i in 5">
						<view class="yuyue-header">
							<image class="yuyue-header-image" :src="imgUrl" mode=""></image>
						</view>
						<view class="yuyue-main">
							<view class="main-name">
								张大姐
							</view>
							<view class="main-score-ioc">
								<text class="ioc-text">标准间(1806)、单人间...等6间房</text>
							</view>
							
						</view>
						<button class="ev-but" plain @click="getEvaluate">去评价</button>
					</view>
				</uni-card>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imgUrl:`${getApp().globalData.imgScr}jd/baojieayi.png`,
				title:'',
				uid:'',
				listData: [{
					id: 1,
					img: `${getApp().globalData.imgScr}jd/fangxing.png`,
					name: '1802',
					money:15.6,
					type:'标准间',
					checked: true,
				}, {
					id: 2,
					img: `${getApp().globalData.imgScr}jd/fangxing.png`,
					name: '1608',
					money:13.6,
					type:'单人间',
					checked: true,
				}, {
					id: 3,
					img: `${getApp().globalData.imgScr}jd/fangxing.png`,
					name: '1205',
					money:16.6,
					type:'单人间',
					checked: true,
				}],
			}
		},
		onLoad(e) {
			console.log(e)
			this.title = e.title
			this.uid = e.uid
		},
		methods: {
			getEvaluate() {
				let path = '/hotelAdmin/indent/evaluate/evaluate'
				uni.navigateTo({
				    url: path,
				});
			}
			}
	}
</script>

<style lang="scss">
	.sub-evaluate {
		position: relative;
		width: 100%;
		// 顶部标题栏样式
		.i-d-title {
			display: flex;
			flex-direction: column;
			box-sizing: border-box;
			width: 100%;
			height: 230rpx;
			background: linear-gradient(-90deg, #8dc9f1, #d8eefc);
			padding: 20rpx 40rpx;
			.i-d-t-text {
				font-size: 40rpx;
				font-weight: bold;
				color: #FFFFFF;
				margin-bottom: 20rpx;
			}
			.i-d-t-text1 {
				font-size: 28rpx;
				font-weight: 500;
				color: #FFFFFF;
			}
		}
		//内容区域样式
		.i-d-top {
			position: absolute;
			top: 150rpx;
			left: 0;
			box-sizing: border-box;
			width: 100%;
			display: flex;
			flex-direction: column;
			margin-bottom: 20rpx;
			overflow: hidden;
			padding: 0 20rpx;

			// 顶部标题栏样式
			.o-t-title {
				display: flex;
				flex-direction: column;
				width: 100%;
				box-sizing: border-box;
				padding: 20rpx;
				margin-bottom: 20rpx;
				border-radius: 20rpx;
				background-color: #FFFFFF;
				overflow: hidden;

				.t-con-text {
					display: flex;
					align-items: center;
					margin-bottom: 20rpx;
					.t-c-text {
						font-size: 28rpx;
						font-weight: 500;
						color: #000000;
						margin-right: 20rpx;
					}
					.uni-rate__icon {
						margin-right: 6rpx!important;
						.uni-icons {
							font-size: 40rpx!important;
						}
					}
				}
				.sub-ev-tag {
					display: flex;
					align-items: center;
					flex-wrap: wrap;
					.ev-tag {
						margin:0 20rpx 20rpx 0;
					}
				}
				.sub-ev-text {
					font-size: 20rpx;
					font-weight: 500;
					color: rgba($color: #000000, $alpha: 0.7);
					margin-bottom: 20rpx;
				}
				
			}
			

			// 中间 列表栏样式
			.o-t-body {
				// flex: 1;
				// overflow: auto;
				.yuyue {
					display: flex;
					align-items: center;
					padding: 20rpx;
					.yuyue-header {
						margin-right: 24rpx;
						.yuyue-header-image {
							width: 100rpx;
							height: 100rpx;
							border-radius: 20rpx;
							border: 0;
						}
					}
					.yuyue-main {
						flex: 1;
						display: flex;
						flex-direction: column;
						justify-content: space-between;
						height: 100rpx;
						.main-name {
							font-size: 28rpx;
							color: #000000;
							font-weight: 600;
						}
						.main-score-ioc {
							display: flex;
							font-size: 24rpx;
							color: rgba($color: #000000, $alpha: 0.5);
							
							.ioc-text {
								font-size: 24rpx;
								font-weight: 500;
								color: rgba($color: #000000, $alpha: 0.5);
							}
						}
					}
					.ev-but {
						line-height: 54rpx;
						font-size: 28rpx;
						color: #FFFFFF;
						border: 0;
						border-radius: 27rpx;
						background: linear-gradient(-90deg, #8dc9f1, #d8eefc);
					}
				}

				// 卡片公共样式
				.uni-card {
					border-radius: 20rpx;
					overflow: hidden;
					.uni-card__header {
						padding: 20rpx 0;
						.uni-card__header-content-title {
							font-size: 28rpx;
							font-weight: 600;
							color: #000000;
						}
					}
					
				}
				
			}
		}
	}
</style>
